<?xml version="1.0" encoding="ISO-8859-1" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:c="http://java.sun.com/jsp/jstl/core"
	xmlns:ui="http://java.sun.com/jsf/facelets">

<h:head>
	<meta charset="utf-8" />

	<title><ui:insert name="title">Ticketer</ui:insert></title>
	<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no, width=device-width" />
	<meta name="description" content="Ticketer" />
	<meta name="author" content="ITM10" />


	<!-- Le styles -->
	<link rel="stylesheet" href="css/foundation.min.css" />
	<link href="css/style.css" rel="stylesheet" />
	<link
		href="http://fonts.googleapis.com/css?family=Josefin+Sans:400,100,700"
		rel="stylesheet" type="text/css" />

	<!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
	<!--[if lt IE 9]>
			<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
		<![endif]-->

	<!-- Le fav and touch icons -->
	<link rel="shortcut icon" href="img/icons/favicon.ico" />

</h:head>
<h:body>

	<f:view>


		<ui:insert name="lilabg">
			<div id="lilabg" class="small">&nbsp;</div>
		</ui:insert>




		<!-- Header and Nav -->

		<div class="row" id="header">
			<div class="four columns mobile-two">
				<h1>
					<a href="index.xhtml"><img src="img/logo.png" alt="Ticketer"
						id="logo" /></a>
				</h1>
			</div>



			<div class="three columns mobile-two push-five">
				<div class="row">


					<div class="eight columns right hide-for-small">
						<div
							style="padding-top: 40px; text-align: right; margin: 0 -10px 0 -22px;">
							<c:if test="#{loginBean.isLoggedIn() == true}">
      						#{loginBean.getCustomer().getEmail()}
      					</c:if>
							<c:if test="#{loginBean.isLoggedIn() == false}">
								<a href="login.xhtml">Anmelden</a>
								<a style="padding-bottom: 10px; padding-left: 5px;"
									href="register.xhtml">Registrieren</a>
							</c:if>
						</div>
					</div>

					<div class="four columns right">
						<a href="cart.xhtml"><button id="cart">
								<img src="img/icons/shopping_cart.png" alt="Warenkorb" /><span><ui:insert
										name="cartCount">#{cartBean.getTotalTicketCount()}</ui:insert></span>
							</button></a>
					</div>

				</div>
			</div>

			<div class="five columns mobile-four pull-three">
				<h:form style="margin-top:25px;">
					<h:inputText class="search" value="#{eventBean.namesearch}" />
					<h:commandButton action="/eventslist" class="search"
						image="img/icons/search.png" />
				</h:form>
			</div>



		</div>
		<!-- End Header and Nav -->


		<ui:insert name="content">

		</ui:insert>


		<!-- Footer -->

		<footer>
		<div class="row">
			<div class="twelve columns">
				<hr />
				<div class="row">
					<div class="six columns">
						<p>
							&copy; Copyright FH JOANNEUM Kapfenberg - ITM10<br />
						</p>
					</div>
					<div class="six columns">
						<ul class="inline-list right">
							<ui:insert name="footer">
								<li><a href="login.xhtml">Anmelden</a></li>
								<li><a href="register.xhtml">Registrieren</a></li>
								<li><a href="eventslist.xhtml">Events suchen</a></li>
								<li><a href="cart.xhtml">Warenkorb</a></li>
								<li><a href="addevent.xhtml">Events eintragen</a></li>
								<li><a href="userevents.xhtml">Meine Events</a></li>
								<li><a href="agb.xhtml">AGB</a></li>
								<li><a href="impressum.xhtml">Impressum</a></li>
								<li><a href="contact.xhtml">Kontakt</a></li>
							</ui:insert>
						</ul>
					</div>
				</div>
			</div>
		</div>
		</footer>


		<!-- Le javascript
    ================================================== -->
		<!-- Placed at the end of the document so the pages load faster -->
		<!--
    	when fixing this I felt like this: http://www.reactiongifs.com/wp-content/uploads/2012/10/f-this-panda.gif
        ... to stop conflicts with primefaces jquery
    -->
		<h:outputScript library="primefaces" name="jquery/jquery.js" />
		<script type="text/javascript">
			var $ = jQuery.noConflict();
		</script>
		<h:outputScript library="js" name="foundation.min.js" />
		<h:outputScript library="js" name="filetypes.js" />

		<ui:insert name="scripts"></ui:insert>
	</f:view>
</h:body>
</html>
